<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html xmlns:svg="http://www.w3.org/2000/svg">
<head>
    <meta charset="utf-8">
    <title>海南省生态环境监测中心资产管理软件</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/css/layui-bi.css" media="all">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/css/public.css" media="all">
    <link rel="shortcut icon" href="<%=request.getContextPath()%>/huazhi/images/favicon.ico"/>
</head>
<style>
    .header {
        height: 80px;
        line-height: 80px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;

    }

    .border-box {
        position: relative;
        width: 100%;
        height: 380px;
        background-color: transparent;
        border: 1px solid #829bea;
        border-radius: 2px;
    }

    .border-box::before {
        position: absolute;
        top: -1px;
        bottom: -1px;
        left: 10px;
        width: calc(100% - 20px);
        content: "";
        border-top: 1px solid #829bea;
        border-bottom: 1px solid #829bea;
        z-index: 0;
    }

    /*.border-box::after {*/
    /*    position: absolute;*/
    /*    top: 10px;*/
    /*    right: -1px;*/
    /*    left: -1px;*/
    /*    height: calc(100% - 20px);*/
    /*    content: "";*/
    /*    border-right: 1px solid #829bea;*/
    /*    border-left: 1px solid #829bea;*/
    /*    z-index: 0;*/
    /*}*/

    /* 数据概览 */
    .layadmin-dataview {

        height: 300px !important;
    }

    .layadmin-dataview > *[carousel-item]:before {
        display: none;
    }

    .layadmin-dataview > *[carousel-item] > div {
        height: 332px;
    }

    .layui-card-body {
        padding: 20px 15px;
    }

    .layui-carousel {
        background-color: transparent;
    }

    .layui-table thead tr {
        background-color: transparent;
    }

    .layui-table {
        background-color: transparent;
        color: #e5dcdc;
    }

    /* css 重置 */
    /**{margin:0; padding:0; list-style:none; }*/
    /*body{ background:#fff; font:normal 12px/22px 宋体;  }*/
    img {
        border: 0;
    }

    /*a{ text-decoration:none; color:#333;  }*/
    /*a:hover{ color:#1974A1;  }*/



    /* 本例子css */
    .txtMarquee-top {
        /*width: 450px;*/
        overflow: hidden;
        position: relative;
        border: 1px solid #ccc;
    }

    .txtMarquee-top .hd {
        overflow: hidden;
        height: 30px;
        background: #f4f4f4;
        padding: 0 10px;
    }

    .txtMarquee-top .hd .prev, .txtMarquee-top .hd .next {
        display: block;
        width: 9px;
        height: 5px;
        float: right;
        margin-right: 5px;
        margin-top: 10px;
        overflow: hidden;
        cursor: pointer;
        background: url("<%=request.getContextPath()%>/huazhi/images/arrow.png") no-repeat;
    }

    .txtMarquee-top .hd .next {
        background-position: 0 -140px;
    }

    .txtMarquee-top .hd .prevStop {
        background-position: -60px -100px;
    }

    .txtMarquee-top .hd .nextStop {
        background-position: -60px -140px;
    }

    /*.txtMarquee-top .bd {*/
    /*    padding: 15px;*/
    /*}*/

    .txtMarquee-top .infoList li {
        height: 24px;
        line-height: 24px;
    }

    .txtMarquee-top .infoList li .date {
        float: right;
        color: #999;
    }

</style>
<body style="background: url(<%=request.getContextPath()%>/images/bg.110420cf.png) no-repeat;
        background-size: 100% 100%;background-attachment:fixed;margin:0px;">
<div class="layui-fluid">
    <div class="layui-card" style="background-color:transparent">
        <div class="layui-card-body">
            <div class="layui-col-md12 header">
                <div class="layui-col-md4" style="color: #fff;font-size:20px;">
                    2020-09-07 13:54:47
                </div>
                <div class="layui-col-md4" style="color: #fff;font-size:30px;text-align: center;">
                    物联网可视化交互平台
                </div>
                <div class="layui-col-md4">
                </div>
            </div>
            <hr style="background-color: #645e5e;"/>
            <div class="layui-row layui-col-space15">

                <div class="layui-col-md3">
                    <div class="layui-card border-box">
                        <div class="layui-card-header" style="color:#fff; background: -webkit-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -o-linear-gradient(left,#4282c8, #234b75,transparent, transparent);
   background: -moz-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -ms-linear-gradient(left,#4282c8, #234b75, transparent, transparent);border-bottom: none">设备概况1
                        </div>
                        <div class="layui-card-body">
                            <div id="one" class="layui-carousel layadmin-carousel layadmin-dataview"
                                 data-anim="fade"
                                 lay-filter="LAY-index-normcol">

                            </div>
                        </div>
                    </div>

                    <div class="layui-card border-box">
                        <div class="layui-card-header" style="color:#fff; background: -webkit-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -o-linear-gradient(left,#4282c8, #234b75,transparent, transparent);
   background: -moz-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -ms-linear-gradient(left,#4282c8, #234b75, transparent, transparent);border-bottom: none">设备概况2
                        </div>
                        <div class="layui-card-body">
                            <div id="two" class="layui-carousel layadmin-carousel layadmin-dataview"
                                 data-anim="fade"
                                 lay-filter="LAY-index-normcol">

                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md9">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md7">
                            <div class="layui-card border-box" style="height: 778px;">
                                <div class="layui-card-header" style="color:#fff; background: -webkit-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -o-linear-gradient(left,#4282c8, #234b75,transparent, transparent);
   background: -moz-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -ms-linear-gradient(left,#4282c8, #234b75, transparent, transparent);border-bottom: none">设备概况3
                                </div>
                                <div class="layui-card-body">

                                </div>
                            </div>
                        </div>
                        <div class="layui-col-md5">
                            <div class="layui-card border-box">
                                <%--                                <div class="layui-card-header" style="color:#fff; background: -webkit-linear-gradient(left,#4282c8, #234b75, transparent, transparent);--%>
                                <%--   background: -o-linear-gradient(left,#4282c8, #234b75,transparent, transparent);--%>
                                <%--   background: -moz-linear-gradient(left,#4282c8, #234b75, transparent, transparent);--%>
                                <%--   background: -ms-linear-gradient(left,#4282c8, #234b75, transparent, transparent);border-bottom: none">设备概况4--%>
                                <%--                                </div>--%>
                                <div class="layui-card-body">
                                    <div id="four" class="layui-carousel layadmin-carousel layadmin-dataview"
                                         data-anim="fade"
                                         lay-filter="LAY-index-normcol">

                                    </div>
                                </div>
                            </div>
                            <div class="layui-card border-box">
                                <div class="layui-card-header" style="color:#fff; background: -webkit-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -o-linear-gradient(left,#4282c8, #234b75,transparent, transparent);
   background: -moz-linear-gradient(left,#4282c8, #234b75, transparent, transparent);
   background: -ms-linear-gradient(left,#4282c8, #234b75, transparent, transparent);border-bottom: none">设备概况5
                                </div>
                                <div class="layui-card-body">
                                    <div class="layui-carousel layadmin-carousel layadmin-dataview"
                                         data-anim="fade"
                                         lay-filter="LAY-index-normcol">
                                        <table class="layui-table" lay-skin="line">
                                            <colgroup>
                                                <col width="150">
                                                <col width="200">
                                                <col>
                                            </colgroup>
                                            <thead>
                                            <tr>
                                                <th style="width: 33.33333333%;">地点</th>
                                                <th style="width: 16.66666667%;">溶解氧</th>
                                                <th style="width: 16.66666667%;">电导体</th>
                                                <th style="width: 16.66666667%;">PH值</th>
                                                <th style="width: 16.66666667%;">色度</th>
                                            </tr>
                                            </thead>
                                        </table>
                                        <div class="txtMarquee-top">
                                            <div class="bd">
                                                <ul class="infoList">
                                                    <li>
                                                        <div class="layui-col-md4" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;" >
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2"  style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                    </li>
                                                    <li>
                                                        <div class="layui-col-md4" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;" >
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2"  style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                    </li>
                                                    <li>
                                                        <div class="layui-col-md4" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;" >
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2"  style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                    </li>
                                                    <li>
                                                        <div class="layui-col-md4" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;" >
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2"  style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                    </li>
                                                    <li>
                                                        <div class="layui-col-md4" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;" >
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2"  style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                    </li>
                                                    <li>
                                                        <div class="layui-col-md4" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;" >
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2"  style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                    </li>
                                                    <li>
                                                        <div class="layui-col-md4" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;" >
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2"  style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                        <div class="layui-col-md2" style="padding:9px 15px;">
                                                            <span style="color: #fff;line-height: 20px;font-size: 14px;min-height: 20px;">大法</span>
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/layui.all.js"></script>
<%--<script src="<%=request.getContextPath()%>/huazhi/lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>--%>
<script src="<%=request.getContextPath()%>/huazhi/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/huazhi/lib/superSlide2.1/jquery1.42.min.js"></script>
<script type="text/javascript"
        src="<%=request.getContextPath()%>/huazhi/lib/superSlide2.1/jquery.SuperSlide.2.1.3.js"></script>
<script>
    layui.use(['table', 'echarts', 'table'], function () {
        var $ = layui.$
            , table = layui.table,
            echarts = layui.echarts;

        var chartOne = echarts.init(document.getElementById('one'))
        var option = {
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b}: {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                left: 10,
                data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎'],
                textStyle: {
                    color: '#fff'//字体颜色
                },
            },
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: ['50%', '70%'],
                    center: ['60%', '50%'],
                    avoidLabelOverlap: false,
                    label: {
                        show: false,
                        position: 'center'
                    },
                    emphasis: {
                        label: {
                            show: true,
                            fontSize: '30',
                            fontWeight: 'bold'
                        }
                    },
                    labelLine: {
                        show: false
                    },
                    data: [
                        {value: 335, name: '直接访问'},
                        {value: 310, name: '邮件营销'},
                        {value: 234, name: '联盟广告'},
                        {value: 135, name: '视频广告'},
                        {value: 1548, name: '搜索引擎'}
                    ]
                }
            ]
        };
        chartOne.setOption(option);
        chartOne.hideLoading();

        var chartTwo = echarts.init(document.getElementById('two'))
        var optionTwo = {

            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c} ({d}%)'
            },
            legend: {
                left: 'center',
                top: 'bottom',
                data: ['rose1', 'rose2', 'rose3', 'rose4', 'rose5', 'rose6', 'rose7', 'rose8'],
                textStyle: {
                    color: '#fff'//字体颜色
                },
            },
            toolbox: {
                show: true,
                feature: {
                    mark: {show: true},
                    dataView: {show: true, readOnly: false},
                    magicType: {
                        show: true,
                        type: ['pie', 'funnel']
                    },
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            series: [

                {
                    name: '面积模式',
                    type: 'pie',
                    center: ['50%', '35%'],
                    radius: '60%',
                    roseType: 'area',
                    startAngle: 400, //起始角度
                    data: [
                        {value: 10, name: 'rose1'},
                        {value: 5, name: 'rose2'},
                        {value: 15, name: 'rose3'},
                        {value: 25, name: 'rose4'},
                        {value: 20, name: 'rose5'},
                        {value: 35, name: 'rose6'},
                        {value: 30, name: 'rose7'},
                        {value: 40, name: 'rose8'}
                    ]
                }
            ]
        };

        chartTwo.setOption(optionTwo);
        chartTwo.hideLoading();


        var chartFour = echarts.init(document.getElementById('four'))

        var optionFour = {
            // title: {
            //     text: '某站点用户访问来源',
            //     subtext: '纯属虚构',
            //     left: 'center'
            // },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎'],
                textStyle: {
                    color: '#fff'//字体颜色
                },
            },
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: '70%',
                    center: ['50%', '60%'],
                    data: [
                        {value: 335, name: '直接访问'},
                        {value: 310, name: '邮件营销'},
                        {value: 234, name: '联盟广告'},
                        {value: 135, name: '视频广告'},
                        {value: 1548, name: '搜索引擎'}
                    ],
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };

        chartFour.setOption(optionFour);
        chartFour.hideLoading();

        jQuery(".txtMarquee-top").slide({
            mainCell: ".bd ul",
            autoPlay: true,
            effect: "topMarquee",
            vis: 2,
            interTime: 50
        });

        // //展示已知数据
        // table.render({
        //     elem: '#demo'
        //     ,cols: [[ //标题栏
        //         {field: 'id', title: 'ID', width: 80, sort: true}
        //         ,{field: 'username', title: '用户名', width: 80}
        //         ,{field: 'email', title: '邮箱', minWidth: 80}
        //         ,{field: 'sign', title: '签名', minWidth: 80}
        //         ,{field: 'sex', title: '性别', width: 80}
        //         ,{field: 'city', title: '城市', width: 80}
        //     ]]
        //     ,data: [{
        //         "id": "10001"
        //         ,"username": "杜甫"
        //         ,"email": "xianxin@layui.com"
        //         ,"sex": "男"
        //         ,"city": "浙江杭州"
        //         ,"sign": "人生恰似一场修行"
        //         ,"experience": "116"
        //         ,"ip": "192.168.0.8"
        //         ,"logins": "108"
        //         ,"joinTime": "2016-10-14"
        //     }, {
        //         "id": "10002"
        //         ,"username": "李白"
        //         ,"email": "xianxin@layui.com"
        //         ,"sex": "男"
        //         ,"city": "浙江杭州"
        //         ,"sign": "人生恰似一场修行"
        //         ,"experience": "12"
        //         ,"ip": "192.168.0.8"
        //         ,"logins": "106"
        //         ,"joinTime": "2016-10-14"
        //         ,"LAY_CHECKED": true
        //     }, {
        //         "id": "10003"
        //         ,"username": "王勃"
        //         ,"email": "xianxin@layui.com"
        //         ,"sex": "男"
        //         ,"city": "浙江杭州"
        //         ,"sign": "人生恰似一场修行"
        //         ,"experience": "65"
        //         ,"ip": "192.168.0.8"
        //         ,"logins": "106"
        //         ,"joinTime": "2016-10-14"
        //     }, {
        //         "id": "10004"
        //         ,"username": "贤心"
        //         ,"email": "xianxin@layui.com"
        //         ,"sex": "男"
        //         ,"city": "浙江杭州"
        //         ,"sign": "人生恰似一场修行"
        //         ,"experience": "666"
        //         ,"ip": "192.168.0.8"
        //         ,"logins": "106"
        //         ,"joinTime": "2016-10-14"
        //     }, {
        //         "id": "10005"
        //         ,"username": "贤心"
        //         ,"email": "xianxin@layui.com"
        //         ,"sex": "男"
        //         ,"city": "浙江杭州"
        //         ,"sign": "人生恰似一场修行"
        //         ,"experience": "86"
        //         ,"ip": "192.168.0.8"
        //         ,"logins": "106"
        //         ,"joinTime": "2016-10-14"
        //     }, {
        //         "id": "10005"
        //         ,"username": "贤心"
        //         ,"email": "xianxin@layui.com"
        //         ,"sex": "男"
        //         ,"city": "浙江杭州"
        //         ,"sign": "人生恰似一场修行"
        //         ,"experience": "86"
        //         ,"ip": "192.168.0.8"
        //         ,"logins": "106"
        //         ,"joinTime": "2016-10-14"
        //     }]
        //     ,skin: 'line' //表格风格
        // });

    });
</script>
</body>
</html>
